<template>
  <div>
    <Loading :loading="loading">
      <Form :ref="formRef" :label-width="130" :model="formData" inline>
        <FormItem prop="sn" label="商户编号:" style="width:30%">
          <Input type="text" v-model="formData.sn"  />
        </FormItem>
        <FormItem prop="name" label="商户名称:" style="width:30%">
          <Input type="text" v-model="formData.name" />
        </FormItem>
        <FormItem prop="num" label="纳税人识别号:" style="width:30%">
          <Input type="text" v-model="formData.num"  />
        </FormItem>
        <FormItem prop="legalPersonName" label="法人代表:" style="width:30%">
          <Input type="text" v-model="formData.legalPersonName" />
        </FormItem>
        <FormItem prop="contactsName" label="联系人:" style="width:30%">
          <Input type="text" v-model="formData.contactsName" />
        </FormItem>
        <FormItem prop="phone" label="联系人手机号:" style="width:30%">
          <Input type="text" v-model="formData.phone"  />
        </FormItem>
        <FormItem prop="email" label="联系人邮箱:" style="width:30%">
          <Input type="text" v-model="formData.email"  />
        </FormItem>
        <FormItem prop="businessMobile" label="企业电话:" style="width:30%">
          <Input type="text" v-model="formData.businessMobile"  />
        </FormItem>
        <FormItem prop="bankName" label="银行名称:" style="width:30%">
          <Input type="text" v-model="formData.bankName"  />
        </FormItem>
        <FormItem prop="bankAccount" label="银行账号:" style="width:30%">
          <Input type="text" v-model="formData.bankAccount"  />
        </FormItem>
        <FormItem prop="cityName" label="城市:" style="width:30%">
          <Input type="text" v-model="formData.cityName"  />
        </FormItem>
        <FormItem prop="address" label="商户地址:" style="width:30%">
          <Input type="text" v-model="formData.address"  />
        </FormItem>
        <FormItem prop="state" label="开票范围:" style="width:30%">
          <Select v-model="formData.state"  >
            <Option value="0">无效</Option>
            <Option value="1">有效</Option>
            <Option value="2">禁止开蓝票</Option>
            <Option value="3">禁止冲红</Option>
          </Select>
        </FormItem>
        <FormItem prop="drawer" label="开票人:" style="width:30%">
          <Input type="text" v-model="formData.drawer"  />
        </FormItem>
        <FormItem prop="reviewer" label="复核人:" style="width:30%">
          <Input type="text" v-model="formData.reviewer"  />
        </FormItem>
        <FormItem prop="payee" label="收款人:" style="width:30%">
          <Input type="text" v-model="formData.payee"  />
        </FormItem>
        <FormItem prop="terminalCode" label="税盘号:" style="width:30%">
          <Input type="text" v-model="formData.terminalCode" placeholder="请输入" />
        </FormItem>
        <FormItem prop="storeNo" label="门店编号:" style="width:30%">
          <Input type="text" v-model="formData.storeNo" placeholder="请输入门店编号,云南区块链冠名商户必填"/>
        </FormItem>
        <FormItem :style="{width: '90%'}">
          <div :style="{textAlign: 'right'}">
            <Button type="primary" @click="handleSubmit">更新</Button>
          </div>
        </FormItem>
          <Divider/>
        <Authc permissions="invoice:taxpayerItems:query">
          <FormItem prop="items" label="商品列表:" style="width:90%">
            <ItemsListTable :taxpayerId="taxpayerId" />
          </FormItem>
        </Authc>
      </Form>
    </Loading>
  </div>
</template>
<script>
import config from "@/utils/config";
import { namespace } from "../module";
import {InputNumber,Input,Button,Select,Form,FormItem,Message,Option,Divider} from "view-design";
import Loading from "@/components/Loading";
import RemoteSelect from "@/components/RemoteSelect";
import RemoteTableSelect from "@/components/RemoteTableSelect";
import SearchBar from "@/components/SearchBar";
import Uuid from "uuid";
import Authc from "@/components/Authc";
import ItemsListTable from '../../taxpayerItems/ItemsListTable';
export default {
  components: {InputNumber,Loading,Input,Button,Form,FormItem,Message,RemoteSelect,RemoteTableSelect,
    SearchBar,SearchBarItem: SearchBar.SearchBarItem,Select,Option,ItemsListTable,Authc,Divider},
  props: ["id"],
  beforeMount: async function() {
    let id = this.$route.params.id;
    let response = await this.$store.dispatch(`${namespace}/getDetail`, id);
    if (response.errorCode === 0) {
      this.formData = response.data;
    }
  },
  data: function() {
    let vm = this;
    return {
      taxpayerId: this.$route.params.id,
      formRef: Uuid.v1(),
      formData: {},
      columns: []
    };
  },
  methods: {
        handleSubmit: function() {
      let vm = this;
      this.$refs[this.formRef].validate(async valid => {
        if (valid) {
          vm.formData.taxpayerId = vm.taxpayerId;
          let response = await vm.$store.dispatch(`${namespace}/localUpdate`,vm.formData);
          if (response.errorCode === 0) {
            vm.$emit("closeAdd");
            this.$Message.success("提交成功");
            vm.$emit("reloadItems");
          }
        }
      });
    }
  },
  computed: {
    loading: function() {
      let result = this.$store.state[namespace].loading;
      return result;
    }
  }
};
</script>

<style>
</style>
